<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>库存调拨-入库</title>
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"/>
		<link rel="stylesheet" type="text/css" href="https://at.alicdn.com/t/font_1322088_w1g067jrt8.css"/>
		<link rel="stylesheet" type="text/css" href="css/style.css"/>
		<link rel="stylesheet" type="text/css" href="js/layui/css/layui.css"/>
		<link rel="stylesheet" href="js/layer/mobile/need/layer.css" />
		<link rel="stylesheet" href="css/caiStyle.css" />
		<link rel="stylesheet" href="css/dingdan.css" />
	</head>
	<body>
		<div class="container-fluid bg-white">
			<!-- 订单列表 -->
			<div class="order order-box">
				<div class="WarehousingTop">
					<div class="mui-col-xs-6 state state1">
						<span>调拨单号：</span>
						<span>DB-20190822-320319 </span>
						<span class="C13c19f">(在途)</span>
					</div>
		
					<div class="mui-col-xs-6 state">
						<div class="caozuo-state mui-col-xs-10 distribution">
							<div class="nav-item cursorP"><i class="iconfont icon-dayin"></i>打印</div>
							<div class="nav-item cursorP"><i class="iconfont icon-daochu"></i>导出</div>
							<div class="nav-item cursorP" onclick="toVoid()"><i class="iconfont icon--zuofei C989696"></i>作废</div>
						</div>
						<div class="heard-right heard-btn mui-col-xs-2 padding-0 flex rightFloat">
							<button type="button" onclick="ruku()">入库</button>
						</div>
					</div>
				</div>
				<div class="ood-box">
					<!-- 顶部工具条 -->
					<nav class="flex">
						<!-- 默认显示的操作栏 -->
						<div class="dutault-nav width100 flex LH35">
							<div class="heard-left width100 flex">
								<div class="mui-col-xs-2 outOfWarehouse"><span>调出仓库:</span><span>上海仓</span></div>
								<div class="mui-col-xs-2 outOfWarehouse"><span>调出时间:</span><span>2019-08-22 15:03</span></div>
								<div class="mui-col-xs-2 outOfWarehouse"><span>调入仓库:</span><span>上海仓</span></div>
								<div class="col-md-3 storageTime flex">
									<div class="mR10">调入时间</div><i class="iconfont icon-riqi"></i><input type="text" class="layui-input" id="test1"></div>
		
							</div>
							<!-- 选择订单后显示操作栏 -->
							<div class="caozuo-nav hidden flex">
								<div class="nav-item"><i class="iconfont icon-guanbi hidden"></i>已选择<span class="changeNum">30</span>项</div>
								<div class="nav-item" onclick="upperShelf()"><i class="iconfont icon-dayin1"></i>打印</div>
							</div>
					</nav>
					<!-- 数据列表 -->
					<div class="order-list">
						<table class="layui-hide" id="order-list" lay-filter="test"></table>
					</div>
					<!--底部信息-->
					<div class="exhibitList">
						<div class="height40 LH40"><span class="C989696 fs16">备注说明：</span></div>
						<div class="height40 LH40">
								<span class="C989696 fs16">经办人：</span><span>罗经理</span>
								<span class="C989696 fs16 mL20">制单人：</span><span>罗经理</span>
						</div>
						
						<div class="height40 LH40">
								<span class="C989696 fs16 cursorP" @click="operation">操作日志<i class="iconfont icon-xiangxia mL10" v-show="xiangxia"></i><i class="iconfont icon-xiangshangjiantouarrowup-copy mL10" v-show="icon"></i></span>
						</div>
					<!-- 操作日志数据列表 -->
						<div class="order-list " v-show="exhibit">
							<table class="layui-hide" id="remarks" lay-filter="test"></table>
						</div>
					</div>
				</div>
			<!-- 新增订单 -->
			<div class="order hidden add-order"></div>
			<!-- 导入订单 -->
			<div class="order hidden import-order"></div>
			</div>
		</div>
		<!--入库的询问框内容-->
		<div class="cent hidden">确认将调拨单<span>DB-20190823-119290</span>入库到<span>上海仓</span>？此操作不可撤销。</div>
			<!--作废的询问框内容-->
		<div class="void hidden">
			<div>确认将调拨单<span>DB-20190823-119290</span>作废 ？ 调拨单作废后状态不可回退 。 如确定作废，请填写原因：</div>
			<textarea name="reworkmes"   cols="47"   rows="4" style="resize: none;padding: 5px;margin-top:10px;"></textarea>
		</div>
		<script src="js/jquery-v3-3.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/bootstrap.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/layui/layui.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/new_file.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/vue.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/Gather.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			
				layui.use(['form','table','laydate','element'], function(){
				var table = layui.table,
				laydate = layui.laydate,
				form = layui.form,
				element = layui.element
				
				//时间范围选择
				laydate.render({
					elem: '#test1'
					,value: '2017-09-10'
  				,isInitValue: true//是否允许填充初始值，默认为 true
				});	
				//操作日志数据的展示
				var vm = new Vue({
					el:".exhibitList",
					data:{
						exhibit:false,
						icon:false,
						xiangxia:true,
					},
					methods:{
						operation(){
							this.exhibit = !this.exhibit;
							this.icon=!this.icon;
							this.xiangxia = !this.xiangxia;
						},
					}
				})
			
				// 数据列表渲染
				table.render({
					elem: '#order-list'
					,data:DataArray3// data为数据库查到的数据
//					,height:300
					,totalRow:true
					,cols: [[//以下field字段为为数据库相同,title为字段描述
					  {field:'mid',title: '',totalRowText: '合计：'}
						,{field:'uname', title: '商品编码'}
						,{field:'sex',title: '商品名称'}
						,{field:'rank', title: '规格'}
						,{field:'uptime',  title: '单位',}
						,{field:'exptime', title: '调拨数量',totalRow:true}
						,{field:'money',title: '备注'}
					]]
					,page: false
				});
				table.render({
					elem: '#remarks'
					,data:DataArray3// data为数据库查到的数据
					,height:80
					,cols: [[//以下field字段为为数据库相同,title为字段描述
					  {field:'userid',title: '操作人'}
						,{field:'time', title: '时间'}
						,{field:'category',title: '操作类别'}
						,{field:'uptime', title: '操作日志'}
					]]
					,page: false
				});
				//监听行单击事件
				table.on('row(test)', function(obj){
				  console.log(obj.tr) //得到当前行元素对象
				  console.log(obj.data) //得到当前行数据
				  //obj.del(); //删除当前行
				  //obj.update(fields) //修改当前行数据
//				  window.open('ddxq.html?data='+obj.data, '_self');
				});
			});
			
				//入库的询问框
				function ruku(){
							layer.open({
								area: ['350px', '200px'],
							type: 5
							,shade: 0.5
							,id: 'LAY_layuipro' //设定一个id，防止重复弹出
							,shadeClose:true
							,title: "调拨单入库确认" //不显示标题栏
							,btn: ['取消','确定']
							,content:$(".cent").html()
						});
				}
			//作废
			function toVoid(){
				layer.open({
								area: ['400px', '280px'],
							type: 5
							,shade: 0.5
							,id: 'LAY_layuipro' //设定一个id，防止重复弹出
							,shadeClose:true
							,title: "调拨单入库确认" //不显示标题栏
							,btn: ['取消','确定']
							,content:$(".void").html()
						});
			}
		</script>
	</body>
</html>
